<template>
 <view class="business">
   <view class="nav d_f j_c_c a_i_c">
   	<view class="text">Salary/day</view>
   	<image src="../../static/ct_0031_返回键.png" mode="" class="right" @tap="back"></image>
   </view>
   <view class="header_text">My Staff: {{mystaff}}</view>
   <image src="../../static/ct_0012_绿色顶.png" mode="" class="header"></image>
   <view class="box">
	 <view v-for="(item,index) in list" :key="index">
		 <!-- <view>My position grade：{{item.name}}</view>
		 <view class="top">My salary：{{item.daily_wage}}u/day</view>
		 <view class="top">Quantitative trading income：{{item.test_income_rate}}%/day</view>
		  <view class="d_f w_100 j_c_c">
		 			 <view class="next d_f j_c_c a_i_c">Next Level</view>
		</view> -->
		<view class="d_f w_100 j_c_c">
		 	<view class="next d_f j_c_c a_i_c">Staff Level：{{item.name}}</view>
		</view>
		<view>Participate in testing USDT：{{item.principal}}</view>
		 <view class="top">Salary：{{item.daily_wage}}u/day</view>
		 <view class="top">Quantitative Trading Incomee：{{item.test_income_rate*100}}%/day</view>
		 <view class="top">Friends：{{item.myfriends}}</view>
	 </view>
	<!-- 	<view >My position grade:{{data.next.name}}</view>
		<view class="top">My salary:{{data.next.daily_wage}}u/day</view>
		<view class="top">Quantitative trading income:{{data.next.test_income_rate}}%/day</view>
		<view class="top">My friends:{{data.next.invite_friend}}(+{{data.next.invite_friend_reach}}%)</view>
		<view class="d_f w_100 j_c_c">
			 <view class="next d_f j_c_c a_i_c">Max Level</view>
		</view>
		<view >My position grade:{{data.max.name}}</view>
		<view class="top">My salary:{{data.max.daily_wage}}u/day</view>
		<view class="top">Quantitative trading income:{{data.max.test_income_rate}}%/day</view> -->
		<!-- <view class="top">My friends:{{data.max.invite_friend}}(+{{data.max.invite_friend_reach}}%)</view> -->
   </view>
   <view class="button d_f j_c_c a_i_c" @tap="click">Data</view>
 </view>
</template>

<script>
 export default {
   data () {
     return {
      data:{
		  next:{},
		  max:{},
	  },
	  mystaff: '',
	  list:[],
     }
   },
   components: {

   },
   methods: {
      back(){
      	uni.navigateBack({
      		delta: 1
      	});
      },
	  getData(){
		  this.$api.getMysalary().then(res=>{
			  this.mystaff = res.data.mystaff;
			  this.list=res.data.list;
		  })
	  },
	  click(){
		  uni.navigateTo({
		  	url:'/pages/index/salaryDate'
		  })
	  }
   },
   onShow() {

   },
   onLoad(options) {
    this.getData()
   },
   watch: {

   },
   computed: {

   }
 }
</script>

<style scoped lang='scss'>
.business{
	width: 100%;
	min-height: 100%;
	background: rgb(239, 237, 238);
	position: relative;
	padding-bottom: 32rpx;
	.nav {
		width: calc(100% - 64rpx);
		height: 160rpx;
		margin-left: 32rpx;
		position: relative;
	    z-index: 9999;
		.text {
			font-size: 32rpx;
			font-weight: 700;
		color: #FFFFFF;
		}
	
		.right {
			width: 20rpx;
			height: 32rpx;
			position: absolute;
			left: 0rpx;
			z-index: 999;
			transform: rotate(180deg);
		}
	}
	.header{
		 position: absolute;
		 top: 0rpx;
		 width: 100%;
		 height: 229rpx;
		 z-index: 1;
	}
    .header_text{
		text-align: center;
		position: absolute;
		width: 100%;
		display: flex;
		top: 120rpx;
		justify-content: center;
		z-index: 99999;
		color: #fff;
		font-size: 32rpx;
		font-weight: 700;
	}
	.box{
		background: url('../../static/ct_0020_渐变底图.png');
		/* height: 830rpx; */
		width: 686rpx;
		margin-left: 32rpx;
		margin-top: 100rpx;
		background-size: 100% 100%;
		padding: 64rpx 32rpx;
		color: #FFFFFF;
		font-size: 28rpx;
		.top{
			margin-top: 20rpx;
		}
		.next{
			width: 360rpx;
			height: 60rpx;
			background: rgb(39,141,99);
			color: #FFFFFF;
			font-size: 28rpx;
			border-radius: 40rpx;
			margin-top: 40rpx;
			margin-bottom: 40rpx;
		}
	}
	.button{
		width: 622rpx;
		margin-left: 64rpx;
		background: rgb(101,186,144);
		color: #FFFFFF;
		border-radius: 20rpx;
		height: 90rpx;
		margin-top: 64rpx;
	}
	
}
</style>